x-x h1,
.h1 {
    font-size: 2em;
    font-weight: bold;
}

x-x h2,
.h2 {
    font-size: 1.5em;
    font-weight: bold;
}

x-x h3,
.h3 {
    font-size: 1.17em;
    font-weight: bold;
}

x-x h4,
.h4 {
    font-size: 1em;
    font-weight: bold;
}

x-x h5,
.h5 {
    font-size: 0.83em;
    font-weight: bold;
}

x-x h6,
.h6 {
    font-size: 0.67em;
    font-weight: bold;
}

.code {
    white-space: pre;
    font-family: monospace;
}

.todo {
    display: flex;
    align-items: center;
}

.todo > input[type="checkbox"] {
    appearance: none;
    width: 1em;
    height: 1em;
    margin-inline-end: 0.4em;
    border: 2px #888 solid;
    cursor: pointer;
    border-radius: 0.25em;
}

.todo > input[type="checkbox"]:checked {
    background-color: #0860f2;
    border: 2px #0860f2 solid;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(255, 255, 255)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 8 9 19 4 14'%3E%3C/polyline%3E%3C/svg%3E");
    background-position: center;
    background-size: 0.75em auto;
    background-repeat: no-repeat;
}
.todo > input[type="checkbox"]:checked + * {
    opacity: 0.5;
}

.iframe,
.iframe > iframe {
    width: 100%;
    height: 100%;
}
x-md:has(.iframe) {
    width: 100%;
    height: 100%;
}

x-x a {
    color: #000099;
    text-decoration: underline;
}

x-x ul {
    padding-left: 2em;
}

x-x x-link {
    color: #0000cc;
}
@media (prefers-color-scheme: dark) {
    x-x x-link {
        color: #2288ff;
    }
}
.flex-column {
    display: flex;
    gap: 1em;
    flex-direction: column;
}

.flex-column > x-x {
    position: relative !important;
    max-width: 100%;
}

.flex-row {
    display: flex;
    gap: 1em;
    flex-direction: row;
}

.flex-row > x-x {
    position: relative !important;
    max-height: 100%;
}

x-x .list {
    padding-left: 2em;
}
